import React, {Component} from 'react';
import {Route,Switch,Redirect} from 'react-router-dom'
import {connect} from 'react-redux'

import {changePath} from '../../actions/routerAction'
import NavFooter from '../../components/common/NavFooter/navFooter'
import MainContent from '../MainContent/mainContent'
import Cate from '../Cate/index'
import Cart from '../Cart/index'
import Search from '../Search/search'
import MineCenter from '../MineCenter/index'
import SearchList from '../Search/SearchList/index'
import GoodsDetail from '../GoodDetail/index'
import Order from '../Order/index'
import './index.scss'

@connect(
    ({routerReducer})=>{
        return {
            paths:routerReducer.paths,
            pathname:routerReducer.currentPath
        }
},
    {changePath}
)
class Index extends Component{
    componentDidUpdate(){
        this.props.changePath(this.props.location.pathname);
    }
    render(){
        let pathTF = false;
        this.props.paths.forEach(v => {
            if (this.props.pathname === null && (this.props.location.pathname === v)) {
                pathTF = true
            } else if (v === this.props.pathname) {
                pathTF = true
            } else if (this.props.location.pathname === v) {
                pathTF = true
            }
        });

        return (
            <div className="index-page">
                <div className='main' style={{
                    marginBottom:pathTF?'50px':'0px'
                }}>
                    <Switch>
                        <Route exact path="/" component={MainContent}></Route>
                        <Route exact path="/index" render={()=><Redirect to="/"/>}></Route>
                        {/*<Route exact path="/cate" component={Cate}></Route>*/}
                        <Route  path="/cate" component={Cate}></Route>
                        <Route path="/goods/:id" component={GoodsDetail}></Route>
                        {/*<Route path="/comments/:id" component={Comments}></Route>*/}
                        <Route path="/order" component={Order}></Route>
                        <Route exact path="/search" component={Search}></Route>
                        <Route exact path="/searchlist/:s" component={SearchList}></Route>
                        <Route exact path="/cart" component={Cart}></Route>
                        <Route component={MineCenter}></Route>
                    </Switch>
                </div>
                {
                    pathTF?
                        <div className="footer">
                            <NavFooter />
                        </div>
                        :null
                }
            </div>
        );
    }
}

export default Index;